<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8" import="java.io.*,org.i_plus.model.*,org.i_plus.model.dao.*"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Tarot</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
function tarot(){
	var maxNum = 22*2;  
	var minNum = 1;  
	var tarot = Math.floor(Math.random() * (maxNum - minNum + 1)) + minNum;  
	alert(tarot);
	alert($("#account").val());
	$.ajax({
		"url":"http://localhost:8080/i_plus/services/memberService",
		"type":"GET",
		"data":{"account":$("#account").val(),"tarot":tarot},
		"dataType":"text"
	});
}
</script>
</head>
<body>

<h3>Welcome!!</h3>
<h5>塔羅牌</h5>
<input type="hidden" id="account" value="${user.account }" />
<c:if test="${not empty tarot}">

${tarot.num}

</c:if>
<c:if test="${empty tarot}">
<input type="submit" onclick="tarot()">
</c:if>
</body>
</html>